<template>  
  <el-header>  
    <el-row style="height: 70px;background-color: black;">  
      <el-col :span="6"><img src="../assets/logo2.png" alt="" style="width: 170px;"></el-col>  
      <el-col :span="14"> &nbsp;</el-col>  
      <el-col :span="4" class="col3">欢迎admin   
        <button @click="handleLogout">退出登录</button>  
      </el-col>  
    </el-row>  
  </el-header>  
</template>  
  
<script>  
import { mapState, mapMutations } from 'vuex'  
  
export default {  
  computed: {  
    ...mapState("user", ["user"])  
  },  
  methods: {  
    ...mapMutations("user", ["deleteUser"]),  
    handleLogout() {  
      // 直接调用 mutation 来删除用户状态  
      this.deleteUser();  
  
      // 然后进行路由跳转  
      this.$router.push('/login'); // 假设你的登录页面路由是 'login'  
    }  
  }  
}  
</script>

<style scoped>
.col3 {
  color: aliceblue;
  padding-top: 24px;
}
</style>